<?php
/**
 * @link https://www.kancloud.cn/cleverstone/ymb2
 * @copyright Copyright (c) 2020 Yii Manager Software LLC
 */

use backend\assets\HomeStaticAsset;

/** @var \yii\web\View $this */

HomeStaticAsset::register($this);
$this->title = '欢迎回来';

/** @var \common\models\Admin $identity */
$identity = Yii::$app->user->identity;
$lastLoginDate = $identity ? $identity->updated_at : null;
?>
<!-- 主内容区域 -->
<div class="welcome-content">
    <!-- 欢迎图标 - Element UI风格简洁设计 -->
    <div class="welcome-icon">
        <svg width="140" height="140" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
            <!-- 主圆形 -->
            <circle cx="50" cy="50" r="45" fill="var(--accent-primary)" opacity="0.1" />

            <!-- 成功图标 - Element UI风格（确保持续可见） -->
            <!-- 动画对号 -->
            <path d="M35,55 L45,65 L65,45" fill="none" stroke="var(--accent-primary)" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="57" stroke-dashoffset="57">
                <animate attributeName="stroke-dashoffset" from="57" to="0" dur="0.6s" fill="freeze" ease="ease-out" begin="0.3s" />
            </path>
            <!-- 静态对号（作为备用，确保始终可见） -->
            <path d="M35,55 L45,65 L65,45" fill="none" stroke="var(--accent-primary)" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" opacity="0">
                <animate attributeName="opacity" from="0" to="1" dur="0.1s" fill="freeze" begin="0.9s" />
            </path>
        </svg>
    </div>

    <!-- 欢迎文本 - Element UI风格 -->
    <div class="welcome-text">
        <!-- SVG动态文本 - 欢迎回来 -->
        <svg class="welcome-svg-text" width="160" height="60" viewBox="0 0 160 60" xmlns="http://www.w3.org/2000/svg">
            <!-- 欢迎回来四个字，每个字单独动画 -->
            <g class="char-container">
                <!-- 欢 -->
                <text x="0" y="45" font-family="var(--font-family-sans-serif)" font-size="32" font-weight="600" fill="url(#textGradient)" opacity="0">
                    欢
                    <animate attributeName="opacity" from="0" to="1" dur="0.4s" begin="0.3s" fill="freeze" />
                    <animate attributeName="x" from="-10" to="0" dur="0.5s" begin="0.3s" fill="freeze" />
                </text>
                <!-- 迎 -->
                <text x="40" y="45" font-family="var(--font-family-sans-serif)" font-size="32" font-weight="600" fill="url(#textGradient)" opacity="0">
                    迎
                    <animate attributeName="opacity" from="0" to="1" dur="0.4s" begin="0.5s" fill="freeze" />
                    <animate attributeName="x" from="30" to="40" dur="0.5s" begin="0.5s" fill="freeze" />
                </text>
                <!-- 回 -->
                <text x="80" y="45" font-family="var(--font-family-sans-serif)" font-size="32" font-weight="600" fill="url(#textGradient)" opacity="0">
                    回
                    <animate attributeName="opacity" from="0" to="1" dur="0.4s" begin="0.7s" fill="freeze" />
                    <animate attributeName="x" from="70" to="80" dur="0.5s" begin="0.7s" fill="freeze" />
                </text>
                <!-- 来 -->
                <text x="120" y="45" font-family="var(--font-family-sans-serif)" font-size="32" font-weight="600" fill="url(#textGradient)" opacity="0">
                    来
                    <animate attributeName="opacity" from="0" to="1" dur="0.4s" begin="0.9s" fill="freeze" />
                    <animate attributeName="x" from="110" to="120" dur="0.5s" begin="0.9s" fill="freeze" />
                </text>
            </g>
            <!-- 渐变定义 -->
            <defs>
                <linearGradient id="textGradient" x1="0%" y1="0%" x2="100%" y2="0%">
                    <stop offset="0%" stop-color="var(--accent-quaternary)" />
                    <stop offset="100%" stop-color="var(--accent-tertiary)" />
                </linearGradient>
            </defs>
        </svg>
        <p>当前系统用户 <span class="font-weight-bolder f16">mirror</span>，最近一次登录时间：<span class="font-weight-bolder f16"><?= $lastLoginDate ?></span>，祝您使用愉快。</p>
    </div>

    <!-- Element UI风格的简洁装饰线 -->
    <div class="decorative-line">
        <div class="line"></div>
    </div>

    <!-- 额外装饰元素 - 更精致的设计 -->
    <div class="additional-elements">
        <svg class="decorative-dots" width="240" height="50" viewBox="0 0 240 50" xmlns="http://www.w3.org/2000/svg">
            <!-- 动态点线 -->
            <g opacity="0">
                <animate attributeName="opacity" from="0" to="1" dur="0.8s" delay="1.5s" fill="forwards" />
                <!-- 点线 -->
                <path d="M30,25 H210" stroke="var(--accent-primary)" stroke-width="1" stroke-dasharray="2 4" opacity="0.3" />
                <!-- 装饰点 -->
                <circle cx="30" cy="25" r="2.5" fill="var(--accent-primary)" opacity="0.5" />
                <circle cx="60" cy="25" r="2" fill="var(--accent-primary)" opacity="0.4" />
                <circle cx="90" cy="25" r="3" fill="var(--accent-secondary)" opacity="0.5" />
                <circle cx="120" cy="25" r="3.5" fill="var(--accent-primary)" opacity="0.6" />
                <circle cx="150" cy="25" r="3" fill="var(--accent-secondary)" opacity="0.5" />
                <circle cx="180" cy="25" r="2" fill="var(--accent-primary)" opacity="0.4" />
                <circle cx="210" cy="25" r="2.5" fill="var(--accent-primary)" opacity="0.5" />
            </g>
        </svg>
    </div>
</div>
